import { Component } from 'react'
import { connect } from 'react-redux'
import { Button } from 'antd'
import { DECREASE } from '@/store/actionType'
import { IState } from '@/store/reducer/count'

interface IProps {
	count: IState
	onDecrease: Function
}

class Sub extends Component<IProps, IState> {
	render() {
		const { count, onDecrease } = this.props
		return (
			<div>
				{count.count}&nbsp;
				<Button type="primary" onClick={() => onDecrease(2)}>
					减少
				</Button>
			</div>
		)
	}
}

const mapStateToProps = (state: { count: IState }) => {
	return {
		count: state.count,
	}
}

const mapDispatchToProps = (dispatch: Function) => {
	return {
		onDecrease: (count: number) => dispatch({ type: DECREASE, count }),
	}
}

export default connect(mapStateToProps, mapDispatchToProps)(Sub)
